import React, { Component } from 'react'
import store from '../../redux/store';
import {jiaAction, jianAction, asyncJiaAction} from '../../redux/actions/zanActions';
import {increAction, decreAction} from '../../redux/actions/cangActions'

export default class Redux extends Component {
    
    render() {
        return (
            <div style={{
                padding: '50px'
            }}>
                <h3>当前的点赞数 {store.getState().zan} </h3>
                <button onClick={this.zan}>点赞</button>
                <button onClick={this.cancel}>取消点赞</button>
                <button onClick={this.asyncZan}>1秒后增加点赞数</button>
                <hr />
                <h3>当前的收藏数 {store.getState().cang}</h3>
                <button onClick={
                    () => {
                        store.dispatch(increAction(2))
                    }
                }>点击收藏</button>
                <button onClick={
                    () => {
                        store.dispatch(decreAction(1));
                    }
                }>取消收藏</button>
            </div>
        )
    }

    asyncZan = () => {
        //调用 store.dispatch
        store.dispatch(asyncJiaAction(10));
    }

    zan = () => {
        store.dispatch(jiaAction(1));
        console.log(store.getState());
    }

    cancel = () => {
        store.dispatch(jianAction(1));
    }

}
